<template>
  <div class="customCard">
    <div class="cardTitle" v-show="title" :style="'color:' + titleColor">{{title}}</div>
    <div class="cardContent">
      <slot name="content"></slot>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String
    },
    titleColor: {
      type: String,
      default: '#999999'
    }
  }
}
</script>

<style scoped>
.customCard {
  margin: 10px;
  background-color: #ffffff;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.05);
}
.customCard .cardTitle {
  color: #999999;
  font-size:13px;
  padding: 10px 10px 0;
}
.customCard .cardContent {
  padding-top: 10px
}
</style>

